<template>
  <div>
    <a-modal v-model="visible" title="还货记录" :width="900" centered destroyOnClose class="return-modal" :footer="false">
      <a-table :rowKey="record => record.id" :columns="columns" :data-source="data" :pagination="false">
        <span slot="action" slot-scope="text, record">
          <a @click="handleDetail(record.id)">详情</a>
          <a @click="handleAbnormal(record.id)" style="margin-left:8px;" v-if="record.isWarn == 1">异常处理</a>
        </span>
      </a-table>
    </a-modal>
    <AbnormalModal ref="abnormal" @refresh="refresh"></AbnormalModal>
  </div>
</template>
<script>
import globalData from '@/views/box/util/global'
import { getBoxReturnList } from '@/api/box/order'
import AbnormalModal from './abnormalModal'
const columns = [
  {
    title: '还货单号',
    dataIndex: 'orderSn'
  },
  {
    title: '还货时间',
    dataIndex: 'createTime'
  },
  {
    title: '已还商品数',
    dataIndex: 'realReturn'
  },
  // {
  //   title: '备注',
  //   dataIndex: 'memo'
  // },
  {
    title: '操作',
    dataIndex: 'action',
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  components: { AbnormalModal },
  data() {
    this.columns = columns
    return {
      visible: false,
      boxId: '',
      data: []
    }
  },
  filters: {
    goodsStatus(v) {
      let status = globalData.goodsStatus
      let result = status.filter(e => e.stateValue == v)
      if (result.length > 0) {
        return result[0].stateName
      } else {
        return v
      }
    }
  },
  methods: {
    show(id) {
      this.boxId = id
      this.visible = true
      this.fetchData()
    },
    fetchData() {
      let params = {
        requestData: {
          boxId: this.boxId
        }
      }
      getBoxReturnList(params).then(res => {
        if (res.code == 0) {
          this.data = res.data
        } else {
          this.$message.warning(res.msg)
        }
      })
    },
    handleDetail(id) {
      this.$refs.abnormal.show('detail', id)
    },
    handleAbnormal(id) {
      this.$refs.abnormal.show('edit', id)
    },
    refresh() {
      this.fetchData()
    }
  }
}
</script>
<style src="../less/modal.less" lang="less" scoped></style>
